<template>
  <view class="share">
    <view class="share-tab">
      <view class="share-tab-title">
        <view class="title-inner">
          <uni-segmented-control
            :current="current"
            :values="items"
            @clickItem="onClickItem"
            style-type="text"
            active-color="#fa541c"
          ></uni-segmented-control>
        </view>
      </view>
    </view>
    <view class="share-tab-content">
        <view v-if="current === 0">
          <search></search>
        </view>
        <view v-if="current === 1">
          <food></food>
        </view>
    </view>
  </view>
</template>

<script>
import search from './search'
import {uniSegmentedControl,uniLoadMore} from '@dcloudio/uni-ui'
import food from './food'
export default {
  name: 'share',
  components: {
    search,
    uniSegmentedControl,
    uniLoadMore,
    food
  },
  data() {
    return {
      items: ['搜索美食','随机美食'], // 头部导航条目
      current: 0, // 当前导航索引
    }
  },
  methods: {
    // 切换导航
    onClickItem(e) {
      console.log(e.currentIndex)
      if (this.current !== e.currentIndex) {
          this.current = e.currentIndex;
      }
      console.log(this.current)
    },
  }
}
</script>
<style lang='scss'>
  .share {
    .share-tab {
      .share-tab-title {
        position: relative;
        .title-inner {
          width: 70%;
          margin: 0 auto;
        }
      }
    }
    // .share-tab-content {
    //   margin-top: 20px;
    // }
  }
</style>
